<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>欢生活</title>
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<link rel="stylesheet" href="/css/mui.min.css">
		<link rel="stylesheet" href="/css/style.css">
	</head>
	<body>
		<header id="header" class="mui-bar mui-bar-nav">
			<h1 class="mui-title">首页</h1>
			<a href="/my/index" class="mui-icon mui-icon-bars mui-pull-right"></a>
		</header>
		<div id="slider" class="mui-slider">
			<div class="mui-slider-group mui-slider-loop">
				@foreach($recommends as $recommend)
				<div class="mui-slider-item mui-slider-item-duplicate">
					<a href="#">
						<img src="{{$recommend['img']}}">
					</a>
				</div>
				@endforeach
				{{--<div class="mui-slider-item">--}}
					{{--<a href="#">--}}
						{{--<img src="/images/banner01.png">--}}
					{{--</a>--}}
				{{--</div>--}}
			</div>
			<div class="mui-slider-indicator">
				<div class="mui-indicator mui-active"></div>
				<div class="mui-indicator"></div>
			</div>
		</div>
		<div class="mui-content" style="padding-top:1px;">
			<div class="mui-content-padded">
				<ul class="mui-table-view mui-grid-view" style="padding-bottom:20px;">
					<li class="mui-table-view-cell mui-col-xs-4">
						<div class="mui-media-body">专业30年</div>
					</li>
					<li class="mui-table-view-cell mui-col-xs-4">
						<div class="mui-media-body">极速上门</div>
					</li>
					<li class="mui-table-view-cell mui-col-xs-4">
						<div class="mui-media-body">收费透明</div>
					</li>
				</ul>
				<div class="title">
					推荐服务
				</div>
				<ul class="mui-table-view mui-grid-view">
					<li class="mui-table-view-cell mui-media mui-col-xs-6">
						<a href="/household">
							<img class="mui-media-object" src="/images/p01.png">
						</a>
					</li>
					<li class="mui-table-view-cell mui-media mui-col-xs-6">
						<a href="/clean">
							<img class="mui-media-object" src="/images/p02.png">
						</a>
					</li>
					<li class="mui-table-view-cell mui-media mui-col-xs-6">
						<a href="/laundry">
							<img class="mui-media-object" src="/images/p03.png">
						</a>
					</li>
					<li class="mui-table-view-cell mui-media mui-col-xs-6">
						<a href="/disinfect">
							<img class="mui-media-object" src="/images/p04.png">
						</a>
					</li>
				</ul>
				<div class="title">
					快速入口
				</div>
				<ul class="mui-table-view mui-grid-view">
					<li class="mui-table-view-cell mui-media mui-col-xs-6">
						<a href="/my/orders">
							<img class="mui-media-object" src="/images/myorders.png">
						</a>
					</li>
					<li class="mui-table-view-cell mui-media mui-col-xs-6">
						<a href="/my/coupons">
							<img class="mui-media-object" src="/images/mycoupons.png">
						</a>
					</li>
				</ul>
				<div class="title">
					用户好评
				</div>
				<ul class="mui-table-view">
					@foreach($comments as $comment)
					<li class="mui-table-view-cell mui-media">
						<a href="javascript:;">
							<img class="mui-media-object mui-pull-left" src="{{$comment['head_img']}}">
							<div class="mui-media-body">
								{{$comment['title']}}
								<p>{{$comment['content']}}</p>
							</div>
						</a>
					</li>
					@endforeach
					{{--<li class="mui-table-view-cell mui-media">--}}
						{{--<a href="javascript:;">--}}
							{{--<img class="mui-media-object mui-pull-left" src="./images/avatar3.jpg">--}}
							{{--<div class="mui-media-body">--}}
								{{--木屋--}}
								{{--<p class="mui-ellipsis">想要这样一间小木屋，夏天挫冰吃瓜，冬天围炉取暖.</p>--}}
							{{--</div>--}}
						{{--</a>--}}
					{{--</li>--}}
					{{--<li class="mui-table-view-cell mui-media">--}}
						{{--<a href="javascript:;">--}}
							{{--<img class="mui-media-object mui-pull-left" src="./images/avatar3.jpg">--}}
							{{--<div class="mui-media-body">--}}
								{{--CBD--}}
								{{--<p class="mui-ellipsis">烤炉模式的城，到黄昏，如同打翻的调色盘一般.</p>--}}
							{{--</div>--}}
						{{--</a>--}}
					{{--</li>--}}

				</ul>
				<p style="text-align: center;color: #ccc;text-indent: 0;">
					--- 已经到底喽 ---
				</p>
			</div>
		</div>
		<script src="/js/mui.min.js"></script>
		<script type="text/javascript">
			mui.init({
				swipeBack: true //启用右滑关闭功能
			});
			mui("#slider").slider({
				interval: 5000
			})
		</script>
	</body>
</html>
